<template>
    <!--        面包屑-->
    <div class="examine">
        <div>
            <el-breadcrumb separator-class="el-icon-arrow-right">
                <el-breadcrumb-item :to="{ path: '/index' }">首页</el-breadcrumb-item>
                <el-breadcrumb-item>酬金结果管理</el-breadcrumb-item>
                <el-breadcrumb-item>酬金审核</el-breadcrumb-item>
            </el-breadcrumb>
        </div>
        <!--        操作-->
        <div :class="this.zhuangtai>=2?'xianshi1':'xiaoshi'" >
            <el-card>
                <el-breadcrumb separator-class="el-icon-arrow-right">
                    <el-breadcrumb-item>条件区域</el-breadcrumb-item>
                </el-breadcrumb>
                <el-form :inline="true" :model="formInline" class="demo-form-inline">
                    <el-form-item label="用户名">
                        <el-input v-model="formInline.user" placeholder="用户名"></el-input>
                    </el-form-item>
                    <el-form-item label="电话">
                        <el-input v-model="formInline.phone" placeholder="电话"></el-input>
                    </el-form-item>
                    <el-form-item label="邮箱">
                        <el-input v-model="formInline.email" placeholder="邮箱"></el-input>
                    </el-form-item>

                </el-form>
            </el-card>
        </div>
        <div class="el-button1">
            <el-card>
                <el-form>
                    <el-form-item >
                        <el-button type="primary" @click="queryDept" >查询</el-button>
                        <el-button type="primary" @click="chongzhi" >重置</el-button>
                        <download-excel :data="json_data" :fields="json_fields" name="酬金审核列表"><el-button type="primary"    >导出</el-button></download-excel>
                    </el-form-item>
                </el-form>
            </el-card> </div>
        <!--        列表-->
        <el-card>
            <el-breadcrumb separator-class="el-icon-arrow-right">
                <el-breadcrumb-item>列表区域</el-breadcrumb-item>
            </el-breadcrumb>
            <el-table
                    :data="daptData"
                    height="550"
                    border
                    style="width: 100%"
                    @selection-change="handleSelectionChange">
                <el-table-column
                        fixed
                        type="selection"
                        width="50"
                >
                </el-table-column>
                <el-table-column
                        prop="username"
                        label="用户"
                        width="180">
                </el-table-column>
                <el-table-column
                        prop="policyName"
                        label="政策名"
                        width="180">
                </el-table-column>
                <el-table-column
                        prop="courseName"
                        label="科目类"
                        width="180">
                </el-table-column>
                <el-table-column
                        prop="result.money"
                        label="应付金额"
                        width="180">
                </el-table-column>
                <el-table-column
                        prop="topMoney"
                        label="封顶金额"
                        width="180">
                </el-table-column>
                <el-table-column
                        prop="result.submitTime"
                        label="发起时间"
                        width="180">
                </el-table-column>
                <el-table-column
                        label="状态"
                        width="180">
                    <template slot-scope="scope">
                        <span :class="scope.row.result.settlementAudit==1?'statusActive':scope.row.result.settlementAudit==2?'statusActive':'statusDel'">{{scope.row.result.settlementAudit==1?'审核中':scope.row.result.settlementAudit==2?'审核成功':'审核失败'}}</span>
                    </template>
                </el-table-column>
                <el-table-column
                        fixed="right"
                        label="操作"
                        width="210px"
                >
                    <template slot-scope="scope" >
                        <el-button type="primary" :class="'xianshi'"  circle @click="chakan(scope.row)" >查看</el-button>
                        <el-button type="primary" :class="zhuangtai>=2?scope.row.result.settlementAudit==1?'xianshi':'xiaoshi':'xiaoshi'"  circle @click="adopt(scope.row)" >通过</el-button>
                        <el-button type="danger" :class="zhuangtai>=2?scope.row.result.settlementAudit==1?'xianshi':'xiaoshi':'xiaoshi'"  circle @click="repulse(scope.row)" >打回</el-button>
                        <el-button type="danger" :class="zhuangtai>=2?scope.row.result.settlementAudit==2?'xianshi':'xiaoshi':'xiaoshi'"  circle @click="shanchu(scope.row)" >删除</el-button>
                        <el-button type="danger" :class="scope.row.result.settlementAudit==3?'xianshi':'xiaoshi'"  circle @click="xiugai(scope.row)" >重新提交</el-button>
                    </template>
                </el-table-column>
            </el-table>
            <div class="page">
                <el-pagination
                        background
                        layout="prev, pager, next"
                        :total="zongyeshu*10"
                        @current-change="fengye($event)"
                >
                </el-pagination>
                总条数：{{zongji}}
                当前页数：{{yeshu}}/{{zongyeshu}}
            </div>
        </el-card>
        <!--对话框 查看-->
        <el-dialog title="查看明细" :visible.sync="dialogFormVisible">
            <el-descriptions class="margin-top"  :column="3" :size="size" border>
                <el-descriptions-item>
                    <template slot="label">
                        政策类型
                    </template>
                    {{this.daptData1.courseName}}
                </el-descriptions-item>
                <el-descriptions-item>
                    <template slot="label">
                        政策名
                    </template>
                    {{this.daptData1.policyName}}
                </el-descriptions-item>
                <el-descriptions-item>
                    <template slot="label">
                        用户邮箱
                    </template>
                    {{this.daptData1.email}}
                </el-descriptions-item>
                <el-descriptions-item>
                    <template slot="label">
                        用户电话
                    </template>
                    {{this.daptData1.phone}}
                </el-descriptions-item>
                <el-descriptions-item>
                    <template slot="label">
                        时间
                    </template>
                    {{this.daptData1.result.submitTime}}
                </el-descriptions-item>
                <el-descriptions-item>
                    <template slot="label">
                        政策开始时间
                    </template>
                    {{this.daptData1.effectiveTime}}
                </el-descriptions-item>
                <el-descriptions-item>
                    <template slot="label">
                        政策结束时间
                    </template>
                    {{this.daptData1.expirationTime}}
                </el-descriptions-item>
                <el-descriptions-item>
                    <template slot="label">
                        封顶金额
                    </template>
                    {{this.daptData1.topMoney}}
                </el-descriptions-item>
                <el-descriptions-item>
                    <template slot="label">
                        金钱
                    </template>
                    {{this.daptData1.result.money}}
                </el-descriptions-item>
                <el-descriptions-item>
                    <template slot="label">
                        结算次数
                    </template>
                    {{this.daptData1.numberLimit}}
                </el-descriptions-item>
                <el-descriptions-item>
                    <template slot="label">
                        已结算次数
                    </template>
                    {{this.daptData1.numbered}}
                </el-descriptions-item>


            </el-descriptions>
            <div slot="footer" class="dialog-footer">
                <el-button @click="dialogFormVisible = false">确定</el-button>
            </div>
        </el-dialog>
        <!--对话框 修改金额-->
        <el-dialog title="请输入修改金额" :visible.sync="dialogFormVisible1">
            <el-input v-model="jine" placeholder="请输入修改金额"></el-input>
            <div slot="footer" class="dialog-footer">
                <el-button @click="querenxiugai">确定</el-button>
            </div>
        </el-dialog>

    </div>

</template>

<script>
    export default {
        name: "ExamineContent",
        data() {
            return {
                zhuangtai: this.$store.state.userInfo.userAction,//用户状态
                daptData: [],//显示
                daptData2: [],//显示
                ce:0,
                ceshi:[],
                zongji: 12,//总计
                yeshu: 1,//页数
                zongyeshu: 10,//总页数
                formInline: {//查询
                    user: '',
                    phone: '',
                    email: ''
                },
                size: '',
                dialogFormVisible: false,//查看明细
                daptData1: {//查看明细
                    result: [
                        {
                            submitTime:'',
                            money:''
                        }

                    ]
                },
                dialogFormVisible1:false,//通过
                jine:'',//修改的金额
                userId:'',
                policyInfoId:'',
                xiugaineirong:{},
                formInline1:{//备注
                    beizhu:''
                },
                json_fields:{
                    username:"username",
                    policyName:"policyName",
                    courseName:"courseName",
                    resultSubmitTime:"result.submitTime",
                    resultMoney:"result.money",
                },
                json_data:[]
            }
        },
        mounted() {
            this.display();//显示
            console.log(this.daptData)
        },
        methods:{
            //显示
            display:function(){
                console.log(this.$store.state.userInfo)
                this.$axios.get("api/remu/querySubmissionReview",
                    {
                        params:{
                            page:1,
                            userAction:this.zhuangtai,
                            userId:this.$store.state.userInfo.id,
                            username:'',
                            phone:'',
                            email:''
                        }
                    }).then((res)=>{
                        console.log(res);
                        if(res.data.code==200){
                            this.daptData=[],
                                this.daptData2=[],
                                this.ceshi=[];
                            console.log(res.data)
                            this.ceshi = res.data.data
                            for(let i=0;i<this.ceshi.length;i++){
                                for(let j=0;j<this.ceshi[i].policyInfoList.length;j++){
                                    this.daptData2[this.ce]={ces:this.ce}
                                    Object.assign(this.daptData2[this.ce],
                                        this.ceshi[i],this.ceshi[i].policyInfoList[j])
                                    this.ce++
                                }
                            }
                            this.daptData=this.daptData2
                            console.log(this.daptData)

                            this.zongji=res.data.count
                            this.zongyeshu=Math.ceil(this.zongji/10)

                        }else {
                            this.$alert(res.data.msg)
                        }
                    }
                )

            },
            //查看
            chakan:function (obj) {
                this.daptData1=[];
                this.dialogFormVisible=true;
                this.daptData1=obj;
                console.log(this.daptData1)
            }
            ,//通过
            adopt:function (obj) {
                console.log(obj)
                this.$axios.post("api/remu/auditPassed",{
                    userId:obj.userId,
                    policyInfoId:obj.id,
                    money:obj.result.money,
                    numbered:obj.numbered,
                    auditMind:"",
                    username:this.$store.state.userInfo.userName
                }).then((res)=>{
                        console.log(res);
                        if(res.data.code==200){
                            console.log(res.data)
                            this.display();//显示
                        }else {
                            this.$alert(res.data.msg)
                        }
                    }
                )


            },
//审核不通过
            repulse:function (obj) {
                console.log(obj)
                this.$axios.post("api/remu/auditNotPassed",{
                    userId:obj.userId,
                    policyInfoId:obj.id,
                    username:this.$store.state.userInfo.userName,
                    auditMind:""
                }).then((res)=>{
                        console.log(res);
                        if(res.data.code==200){
                            console.log(res.data)

                            this.display();//显示
                        }else {
                            this.$alert(res.data.msg)
                        }
                    }
                )
            },
            //删除
            shanchu:function(obj){
                console.log(obj)
                this.$axios.post("api/remu/deleteBillingData",{
                    userId:obj.userId,
                    policyInfoId:obj.id
                }).then((res)=>{
                        console.log(res);
                        if(res.data.code==200){
                            console.log(res.data)
                            this.display();//显示
                        }else {
                            this.$alert(res.data.msg)
                        }
                    }
                )
            },
            //修改
            xiugai:function(obj){
                this.dialogFormVisible1=true
                console.log(obj)
                this.jine=obj.result.money
                this.userId=obj.userId
                this.policyInfoId=obj.id
            },
            //确认修改
            querenxiugai:function(){
                this.dialogFormVisible1=false;
                this.$axios.post("api/remu/resubmit",{
                    userId:this.userId,
                    policyInfoId:this.policyInfoId,
                    money:this.jine
                }).then((res)=>{
                        console.log(res);
                        if(res.data.code==200){
                            console.log(res.data)
                            this.display();//显示
                        }else {
                            this.$alert(res.data.msg)
                        }
                    }
                )
            },

            queryDept:function () {//查询
                console.log(this.formInline)
                this.$axios.get("api/remu/querySubmissionReview",
                    {
                        params:{
                            userAction:this.zhuangtai,
                            userId:this.$store.state.userInfo.id,
                            username:this.formInline.user,
                            phone:this.formInline.phone,
                            email:this.formInline.email
                        }
                    }).then((res)=>{
                        console.log(res);
                        if(res.data.code==200){
                            this.daptData=[],
                                this.daptData2=[],
                                this.ceshi=[];
                            console.log(res.data)
                            this.ceshi = res.data.data
                            for(let i=0;i<this.ceshi.length;i++){
                                for(let j=0;j<this.ceshi[i].policyInfoList.length;j++){
                                    this.daptData2[this.ce]={ces:this.ce}
                                    Object.assign(this.daptData2[this.ce],
                                        this.ceshi[i],this.ceshi[i].policyInfoList[j])
                                    this.ce++
                                }
                            }
                            this.daptData=this.daptData2
                            console.log(this.daptData)



                            this.zongji=res.data.count
                            this.zongyeshu=Math.ceil(this.zongji/10)
                        }else {
                            this.$alert(res.data.msg)
                        }
                    }
                )
            },
            chongzhi:function () {//重置
                this.formInline.user="";
                this.formInline.phone="";
                this.formInline.email="";
                this.display();
            },
            fengye:function (e) {
                console.log(e)
                this.yeshu=e;
                this.$axios.get("api/remu/querySubmissionReview",
                    {
                        params:{
                            page:this.yeshu,
                            userAction:this.zhuangtai,
                            userId:this.$store.state.userInfo.id,
                            username:'',
                            phone:'',
                            email:''
                        }
                    }).then((res)=>{
                        console.log(res);
                        if(res.data.code==200){
                            console.log(res.data)
                            this.daptData=res.data.data
                            console.log(this.daptData)
                            this.zongji=res.data.count
                            this.zongyeshu=Math.ceil(this.zongji/10)
                        }else {
                            this.$alert(res.data.msg)
                        }
                    }
                )


            },
            handleSelectionChange(val){
                this.json_data=[];
                for(let i=0;i<val.length;i++){
                    this.json_data[i]=val[i].result[0]
                    Object.assign(this.json_data[i],val[i])
                }

                console.log(this.json_data)
            }
        }
    }
</script>

<style scoped>
    .examine .el-card{
        margin: 10px 0;
    }
    .page {
        margin-top: 20px;
    }
    .el-breadcrumb {
        margin-bottom: 10px;
    }
    .statusActive{
        padding: 5px 10px;
        color: white;
        background-color: green;
    }
    .statusDel{
        padding: 5px 10px;
        color: white;
        background-color: red;
    }
    .xianshi{
        display: inline-block;
    }
    .xianshi1{
        display:block;
    }
    .xiaoshi{
        display: none;
    }
    .el-form-item{
        margin-bottom: 0;
    }
    .el-form{
        text-align: center;
    }
    .el-card .el-pagination{
        text-align: center;
    }
    .el-button1 .el-form-item{

    }
    .el-button1 :nth-child(3){
        width: 70px;
        height: 40px;
        display: inline-block;
        margin-left: 10px;
    }
    #export{

    }
</style>